#{extends 'nui.html' /}
#{set title:'用户登录' /}
#{set 'moreStyles'}
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/login.css'}" />

<link rel="stylesheet" media="screen" href="@{'/public/qq_callcenter/css/index.css'}" />
#{/set}
<div id="centerBox">
	<img style='padding:10px 20px' src='@{'/public/images/logo_png.png'}' />
	<div class="formBlock floatLeft">
		<div class="formBlockInner">
			<div class="formBlockTitle tc f15">用户登录</div>
			<form id="loginForm" method="post" action="/doLogin">
				#{authenticityToken/}
				<div style="padding:20px 0;">
					#{if msg}
					<div class="errBox">${msg}</div>
					#{/if}
					<div class="panelLine sec clearfix">
						<input type="text" name="nick"  class="inputText floatLeft ls long required" id="nick" placeholder="昵称"/>
					</div>
					<div class="panelLine sec clearfix" style='margin-top:15px'>
						<input type="password" name="pass" class="inputText floatLeft ls long required" id="pass" placeholder="密码"/>
					</div>
					<div class="clearfix">
					</div>
					<div class="panelLine sec" id="captchaimage" style="display:none">
						<input type="text" name="captcha" class="inputText floatLeft ls short" id="captcha" style="width:100px">
						<span class="ls floatLeft">
							<a href="#" id="refreshimg" title="点击换一张">
								<img src="" width="100" height="46" />
							</a>
						</span>
					</div>
						
						<p style='margin-top:15px;'><a href="javascript:;" class="login_button" id="btnLogin">登 录</a></p>
						<p style='text-align:right;padding-right:15px;padding-top:15px;'><a href="/findPass" class="jumpLink  f12" id="lnkForget">忘记密码?</a></p>
						<p style='text-align:center;margin-top:15px;'><a href="/regist" style='color:#999'>买手注册</a> &nbsp;&nbsp;&nbsp;&nbsp; | &nbsp;&nbsp;&nbsp;&nbsp; <a href="/registsj" style='color:#999'>商家注册</a></p>
				
				</div>
			</form>
		</div>
	</div>
	<div class="clearFix"></div>
</div>




<div class="service_box">
  <ul class="tab_nav">
    <li><a href="http://www.weizhuan.la"><i class="icon icon_1"></i>在线客服</a></li>
    <li><a href="http://www.weizhuan.la"><i class="icon icon_3"></i></a></li>
  </ul>
  <div class="tab_content">
    <div class="tab_plan">
      <p class="fs14">财务充值:<br />
        <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=177805290&amp;site=qq&amp;menu=yes" class="qq_link"><img border="0" src="http://wpa.qq.com/pa?p=2:177805290:51" alt="点击这里给我发消息" title="点击这里给我发消息"></a></p>
      <p class="fs14 mt10">客服微微:<br />
        <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=177805291&amp;site=qq&amp;menu=yes" class="qq_link"><img border="0" src="http://wpa.qq.com/pa?p=2:177805291:51" alt="点击这里给我发消息" title="点击这里给我发消息"></a></p>
        <p class="fs14 mt10">客服赚赚:<br />
        <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=177805292&amp;site=qq&amp;menu=yes" class="qq_link"><img border="0" src="http://wpa.qq.com/pa?p=2:177805292:51" alt="点击这里给我发消息" title="点击这里给我发消息"></a></p>
      <p class="fs14 mt10">客服啦啦:<br />
        <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=177805293&amp;site=qq&amp;menu=yes" class="qq_link"><img border="0" src="http://wpa.qq.com/pa?p=2:177805293:51" alt="点击这里给我发消息" title="点击这里给我发消息"></a></p>
      <p class="mt10">服务时间:<br />
        9:00-20:00(工作日)<br />
      </p>
    </div>
    <div class="tab_plan" style="display: none;"><img src="@{'public/qq_callcenter/images/weixin.jpg'}" alt="官方微信自助客服" width="130" height="130">
      <p>扫一扫关注微赚站长</p>
    </div>
  </div>
</div>
#{set 'moreScripts'}
<script src="@{'/public/javascripts/user/login.js'}" type="text/javascript"></script>


<script type="text/javascript">
$(".service_box .tab_nav li").hover(function(){
	var i=$(this).index();
	$(this).addClass("active").siblings().removeClass("active");
	$(".service_box .tab_plan:eq("+i+")").show().siblings().hide();
});
$(function(){
	var t;
	$(".service_box").hover(function(){
		$(".service_box").animate({right:0},300)
		clearTimeout(t);
	},function(){
		t=setTimeout(function(e){
			$(".service_box").animate({right:"-146px"},300);
			$(".service_box").find(".tab_nav li").removeClass("active");
		},1000);
	});
});
var isTransition=true;
$(".m_logo").hover(function(){
	var r=0;
	if(isTransition){
		animateTime = setInterval(function(){
			if (r>=153){
				clearInterval(animateTime);
				isTransition=true;
			}else{
				isTransition=false;
				r++;
				$(".m_logo a").attr("style","-webkit-mask:-webkit-gradient(radial, 45 25, "+r+", 45 25, "+(r+15)+", from(rgb(0, 0, 0)), color-stop(0.5, rgba(0, 0, 0, 0.2)), to(rgb(0, 0, 0)));")
			};
		},5);
	}
},function(){
	return;
});

</script> 
<!--[if lt IE 7]>
<script type="text/javascript">
	window.onscroll = function(){
		doc_scroll();
	};
	var doc_scroll = function(){
		var height = document.documentElement.clientHeight - 90 ;
		var scroll_top = $(document).scrollTop() ;
		$(".service_box").css({
			"top" : height + scroll_top - 74
		});
	};
	doc_scroll();
</script> 
<![endif]-->
#{/set}